<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body></body>
  <script>
    // 数组扁平化
    let arr = [1, [2, [3, [4, [5]]]]];
    // 要求将数组扁平化处理 [1,2,3,4,5,6]

    // 方法一 是数组自带的扁平化方法
    // flat() 这个函数可以直接打印，该方法返回一个新数组，对原数据没有影响
    // 如果 flat 函数不带参数时：默认 "拉平"一层
    // flat 可以传入一个整数，表示想要 "拉平" 层数
    // 如果传入的参数 <= 0的整数时,则返回原数组,不"拉平".
    // 如果是小数则返回小数点前面数值的层数
    console.log(arr.flat(1));

    // infinity 关键字作为参数时，当你无论嵌套多少层数组，都会转换为一维数组
    console.log(arr.flat(Infinity));

    // 如果原数组有空格，flat() 方法会跳过空格
    console.log(arr.flat());

    // for() 方法
    function flatter(arr) {
      // 创建新数组
      let result = [];
      for (let i = 0; i < arr.length; i++) {
        // 循环判断数组的每一项是否是数组
        if (Array.isArray(arr[i])) {
          // 是数组就递归调用上层扁平化的代码
          result = result.concat(flatter(arr[i]));
        } else {
          // 不是数组，直接通过push添加到返回值数组
          result.push(arr[i]);
        }
      }
      // 返回新数组
      return result;
    }
    console.log(flatter(arr));

    // 指定展开的深度
    // for...of 方法 传递两个参数
    // 参数1：需要扁平化的数组
    // 参数2：可选值，表示要遍历多维数组的深度，默认值为1。
    let arr1 = [1, [2, 3, [4, 5], [6, [7]]], [8, 9]];
    function myFlat(arr, depth = 1) {
      // 如果depth<=0,则直接返回原数组，不拉平任意数组层数
      if (depth <= 0) {
        return arr;
      }
      // 如果 depth > 0,则需要将数组循环遍历
      let res = [];
      for (const item of arr) {
        if (Array.isArray(item)) {
          // 是数组就递归调用上层扁平化的代码,如果当前的子数组为空数组减去当前数组
          res = res.concat(myFlat(item, depth - 1));
        } else {
          res.push(item);
        }
      }
      return res;
    }
    console.log(myFlat(arr1, 1));
  </script>
</html>
